﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="NodeForm.aspx.cs" Inherits="WebApplication.Admin.NodeForm" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>节点编辑</title>
    <script src="../../scripts/boot.js" type="text/javascript"></script>
    <style type="text/css">
        .form-label
        {
            width: 80px;
        }
    </style>
</head>
<body>
    <div class="mini-fit" id="rootPanel" style="padding: 5px">
        <form id="form1" method="post" runat="server" enctype="multipart/form-data">
        <asp:HiddenField ID="hidID" ClientIDMode="Static" runat="server" />
        <asp:HiddenField ID="hidModelData" ClientIDMode="Static" runat="server" />
        <asp:HiddenField ID="hidProjectID" ClientIDMode="Static" runat="server" />
        <table class="form-table" border="0" cellpadding="1" cellspacing="2" width="100%">
            <tr>
                <td class="form-label">
                    内容：
                </td>
                <td colspan="3">
                    <input name="Content" class="mini-textbox" vtype="required;maxLength:500" width="100%" />
                </td>
            </tr>
            <tr>
                <td class="form-label">
                    说明：
                </td>
                <td colspan="3">
                    <input name="Description" class="mini-textarea" vtype="maxLength:1024" width="100%"
                        height="80px" />
                </td>
            </tr>
            <tr>
                <td class="form-label">
                    标准工期：
                </td>
                <td colspan="3">
                    <input name="StandardDays" class="mini-textbox" vtype="required;int" />
                </td>
            </tr>
        </table>
        <table class="form-table" border="0" cellpadding="0" cellspacing="0" width="100%">
            <tr>
                <td style="width: 30%">
                    <div style="width: 100%; margin-top: 5px;">
                        <div class="mini-toolbar" style="border-bottom: 0; padding: 0px;">
                            <table style="width: 100%;">
                                <tr>
                                    <td>
                                        流程：
                                    </td>
                                    <td align="right">
                                        <a class="mini-button" iconcls="icon-add" onclick="selectPoint()" plain="true">添加流程</a>
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </div>
                    <div id="dataGridPoint" class="mini-datagrid" style="width: 100%; height: 180px;"
                        allowcelledit="true" allowcellselect="true" multiselect="true" showpager="false"
                        allowcellvalid="true" editnextonenterkey="true" editnextrowcell="true" idfield="ID"
                        emptytext="数据为空" showemptytext="true">
                        <div property="columns">
                            <div type="indexcolumn" headeralign="center">
                                序号</div>
                            <div type="checkcolumn">
                            </div>
                            <div field="Name" width="100%" vtype="required;maxLength:50">
                                名称
                            </div>
                            <div field="Order" width="80" vtype="required;int">
                                排序
                                <input property="editor" class="mini-textbox" />
                            </div>
                            <div name="edit" field="ID" width="60" align="center" headeralign="center">
                                操作
                            </div>
                        </div>
                    </div>
                </td>
                <td align="right">
                    <div style="width: 99%; margin-top: 5px;">
                        <div class="mini-toolbar" style="border-bottom: 0; padding: 0px;">
                            <table style="width: 100%;">
                                <tr>
                                    <td>
                                        联系人：
                                    </td>
                                    <td align="right">
                                        <a class="mini-button" iconcls="icon-add" onclick="selectContacts()" plain="true">添加联系人</a>
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </div>
                    <div id="dataGridContacts" class="mini-datagrid" style="width: 99%; height: 180px;"
                        allowcelledit="true" allowcellselect="true" multiselect="true" showpager="false"
                        allowcellvalid="true" editnextonenterkey="true" editnextrowcell="true" idfield="ID"
                        emptytext="数据为空" showemptytext="true">
                        <div property="columns">
                            <div type="indexcolumn" headeralign="center">
                                序号</div>
                            <div type="checkcolumn">
                            </div>
                            <div field="Name" width="100%" vtype="required;maxLength:50">
                                联系人姓名
                            </div>
                            <div field="PhoneNumber" width="100%" vtype="required;maxLength:50">
                                联系人电话
                            </div>
                            <div field="Title" width="100%" vtype="required;maxLength:50">
                                联系人职务
                            </div>
                            <div field="RelatedParty" width="100%" vtype="required;maxLength:50">
                                与我司人员关系
                            </div>
                            <div name="edit" field="ID" width="60" align="center" headeralign="center">
                                操作
                            </div>
                        </div>
                    </div>
                </td>
            </tr>
        </table>
        <div style="width: 100%; margin-top: 5px;">
            <div class="mini-toolbar" style="border-bottom: 0; padding: 0px;">
                <table style="width: 100%;">
                    <tr>
                        <td>
                            准备文件：
                        </td>
                        <td align="right">
                            <a class="mini-button" iconcls="icon-add" onclick="addFiles('dataGridInputFiles')"
                                plain="true">添加准备文件</a>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div id="dataGridInputFiles" class="mini-datagrid" style="width: 100%; height: 150px"
            showpager="false" idfield="ID">
            <div property="columns">
                <div type="indexcolumn" headeralign="center">
                    序号</div>
                <div type="checkcolumn">
                </div>
                <div field="Name" width="200" vtype="maxLength:100">
                    文件名称
                    <input property="editor" class="mini-textbox" style="width: 100%;" />
                </div>
                <div field="Department" width="200" vtype="requeired;maxLength:50">
                    责任部门
                    <input property="editor" class="mini-textbox" style="width: 100%;" />
                </div>
                <div field="FileURI" width="100%" vtype="requeired">
                    文件
                    <input property="editor" name="InFiles" class="mini-htmlfile" limittype="*.txt;*.doc;*.docx,*.xls,*.xlsx,*.pdf"
                        style="width: 100%;" />
                </div>
                <div name="edit" field="ID" width="60" align="center" headeralign="center">
                    操作
                </div>
            </div>
        </div>
        <div style="width: 100%; margin-top: 5px;">
            <div class="mini-toolbar" style="border-bottom: 0; padding: 0px;">
                <table style="width: 100%;">
                    <tr>
                        <td>
                            成果文件：
                        </td>
                        <td align="right">
                            <a class="mini-button" iconcls="icon-add" onclick="addFiles('dataGridOutputFiles')"
                                plain="true">添加成果文件</a>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div id="dataGridOutputFiles" class="mini-datagrid" style="width: 100%; height: 150px"
            showpager="false" idfield="ID">
            <div property="columns">
                <div type="indexcolumn" headeralign="center">
                    序号</div>
                <div type="checkcolumn">
                </div>
                <div field="Name" width="200" allowsort="true" vtype="maxLength:100">
                    文件名称
                    <input property="editor" class="mini-textbox" style="width: 100%;" />
                </div>
                <div field="FileURI" width="100%" allowsort="true" vtype="requeired">
                    文件
                    <input property="editor" name="OutFiles" class="mini-htmlfile" limittype="*.txt;*.doc;*.docx,*.xls,*.xlsx,*.pdf"
                        style="width: 100%;" />
                </div>
                <div name="edit" field="ID" width="60" align="center" headeralign="center">
                    操作
                </div>
            </div>
        </div>
        <div style="text-align: center; padding: 10px;">
            <a id="btnSave" class="mini-button" onclick="SaveData" iconcls="icon-save" style="width: 60px;
                margin-right: 20px;">保存</a><a id="btnOk" class="mini-button" onclick="onOk" iconcls="icon-save"
                    style="width: 60px; margin-right: 20px;">确定</a> <a class="mini-button" onclick="onCancel"
                        iconcls="icon-cancel" style="width: 60px;">取消</a>
        </div>
        </form>
    </div>
    <script type="text/javascript" desc="保存 通用">
        mini.parse();
        var form = new mini.Form("form1");
        function SaveData(callback) {
            if (!form.validate()) { return; }
            //            if (dataGridPoint.getData().length == 0) {
            //                mini.alert("请添加流程！"); return;
            //            }
            dataGridPoint.validate();
            if (!dataGridPoint.isValid()) {
                mini.alert("流程数据有错误，请处理后在保存！"); return;
            }

            dataGridInFiles.validate();
            if (!dataGridInFiles.isValid()) { mini.alert("准备文件有错误，请处理后在保存！"); return; }
            dataGridOutFiles.validate();
            if (!dataGridOutFiles.isValid()) { mini.alert("结果文件有错误，请处理后在保存！"); return; }

            var inFiles = dataGridInFiles.getChanges();
            var filesData = dataGridInFiles.getEditData();
            for (var i = 0; i < inFiles.length; i++) {
                if (inFiles[i]._state == "added") {
                    for (var j = 0; j < filesData.length; j++) {
                        if (filesData[j].Name && inFiles[i].ID == filesData[j].ID) {
                            inFiles[i].Name = filesData[j].Name;
                            inFiles[i].Department = filesData[j].Department;
                            break;
                        }
                    }
                }
            }

            var outFiles = dataGridOutFiles.getChanges();
            filesData = dataGridOutFiles.getEditData();
            for (var i = 0; i < outFiles.length; i++) {
                if (outFiles[i]._state == "added") {
                    for (var j = 0; j < filesData.length; j++) {
                        if (filesData[j].Name && outFiles[i].ID == filesData[j].ID) {
                            outFiles[i].Name = filesData[j].Name;
                            break;
                        }
                    }
                }
            }

            for (var i = 0; i < pointContacts.length; i++) {
                pointContacts[i].Contacts = new Array();
                for (var j = 0; j < addedContacts.length; j++) {
                    if (pointContacts[i].Point.ID == addedContacts[j].NodePointID) {
                        pointContacts[i].Contacts.push(addedContacts[j]);
                    }
                }
                for (var j = 0; j < deletedContacts.length; j++) {
                    if (pointContacts[i].Point.ID == deletedContacts[j].NodePointID) {
                        pointContacts[i].Contacts.push(deletedContacts[j]);
                    }
                }
            }

            var data = form.getData();
            data.ID = $("#hidID").val();
            if (data.ID == "") { data.ID = undefined; }
            var submitData = { Node: data, PointContacts: pointContacts, InFiles: inFiles, OutFiles: outFiles };
            if (flag) { console.log(submitData); return; }
            var json = mini.encode(submitData);
            $("#hidModelData").val(json);
            mini.get("rootPanel").loading("保存中，请稍后......");
            form1.submit(); return;
        }
        var flag = false;
    </script>
    <script type="text/javascript" desc="流程联系人">
        var dataGridPoint = mini.get("dataGridPoint");
        dataGridPoint.on("drawcell", pointGridDrawCell);
        dataGridPoint.on("rowclick", pointGridSelect);
        var dataGridContacts = mini.get("dataGridContacts");
        dataGridContacts.on("drawcell", contactGridDrawCell);
        var deletedContacts = new Array();
        var addedContacts = new Array();

        function pointGridDrawCell(e) {
            var column = e.column;
            if (column.name == "edit") {
                e.cellStyle = "text-align:center";
                e.cellHtml = '<span class="operationBtn icon-remove" title="移除" onclick="pointGridRemoveRow(\'' + e.sender.getRow(e.rowIndex).ID + '\')"></span>';
            }
        }
        function contactGridDrawCell(e) {
            var column = e.column;
            if (column.name == "edit") {
                e.cellStyle = "text-align:center";
                e.cellHtml = '<span class="operationBtn icon-remove" title="移除" onclick="contactGridRemoveRow(\'' + e.sender.getRow(e.rowIndex)._uid + '\')"></span>';
            }
        }
        function pointGridSelect(e) {
            var point = dataGridPoint.getSelected();
            if (!point) { return; }
            for (var i = 0; i < pointContacts.length; i++) {
                if (pointContacts[i].Point.ID == point.ID) {
                    dataGridContacts.setData(pointContacts[i].Contacts); return;
                }
            }
            dataGridContacts.setData([]);
        }

        var pointContacts = new Array();

        function selectPoint() {
            mini.open({
                url: "/Business/PointSelect.aspx?" + new Date().getTime(),
                title: "选择流程", width: 800, height: 640,
                ondestroy: function (action) {
                    if (action == "ok") {
                        var iframe = this.getIFrameEl();
                        var datas = mini.clone(iframe.contentWindow.GetData());
                        var existsData = dataGridPoint.getData();
                        var length = existsData.length;
                        for (var i = 0; i < datas.length; i++) {
                            var flag = false;
                            for (var j = 0; j < existsData.length; j++) {
                                if (existsData[j].PointID == datas[i].ID) { flag = true; break; }
                            }
                            if (!flag) {
                                var point = { ID: newGuid(), PointID: datas[i].ID, NodeID: $("#hidID").val(), Name: datas[i].Name, Order: length };
                                dataGridPoint.addRow(point, length); length++;
                                var pointContactsObj = { Point: point, Contacts: new Array() }; pointContacts.push(pointContactsObj);
                            }
                        }
                    }
                }
            });
        }

        function selectContacts() {
            var point = dataGridPoint.getSelected();
            if (!point) { mini.alert("请选择一个流程！"); return; }
            mini.open({
                url: "/Business/ContactsSelect.aspx",
                title: "选择联系人", width: 800, height: 640,
                ondestroy: function (action) {
                    if (action == "ok") {
                        var iframe = this.getIFrameEl();
                        var datas = mini.clone(iframe.contentWindow.GetData());
                        var pointContactsObj = getPoint(point.ID);
                        for (var i = 0; i < datas.length; i++) {
                            var flag = false;
                            for (var j = 0; j < pointContactsObj.Contacts.length; j++) {
                                if (datas[i].ID == pointContactsObj.Contacts[j].ContactID) { flag = true; break; }
                            }
                            if (!flag) {
                                var data = { NodePointID: point.ID, ContactID: datas[i].ID, Name: datas[i].Name, Title: datas[i].Title, PhoneNumber: datas[i].PhoneNumber, RelatedParty: datas[i].RelatedParty, _state: "added" };
                                dataGridContacts.addRow(data, pointContactsObj.Contacts.length);
                                addedContacts.push(data);
                                var pointRow = dataGridPoint.getSelected();
                                if (pointRow._state != "added") {
                                    dataGridPoint.getSelected()._state = "modified";
                                }
                            }
                        }
                    }
                }
            });
        }

        function pointGridRemoveRow(uid) {
            if (uid != undefined) {
                var row = dataGridPoint.getRowById(uid);
                dataGridPoint.removeRow(row);
                dataGridContacts.setData([]);
            }
        }


        function contactGridRemoveRow(uid) {
            var pointRow = dataGridPoint.getSelected();
            var row = dataGridContacts.getRowByUID(uid);
            dataGridContacts.removeRow(row);
            if (row._state == "added") {
                for (var i = 0; i < addedContacts.length; i++) {
                    if (row.NodePointID == addedContacts[i].NodePointID && row.ContactID == addedContacts[i].ContactID) {
                        addedContacts.splice(i, 1); break;
                    }
                }
            } else {
                if (pointRow._state != "added") {
                    dataGridPoint.getSelected()._state = "modified";
                }
                row._state = "removed";
                deletedContacts.push(row);
            }
        }

        function getPoint(id) {
            for (var i = 0; i < pointContacts.length; i++) {
                if (pointContacts[i].Point.ID == id) { return pointContacts[i]; }
            }
            return null;
        }

        function delPoint(id) {
            for (var i = 0; i < pointContacts.length; i++) {
                if (pointContacts[i].Point.ID == id) { pointContacts.splice(i, 1); return; }
            }
        }
    </script>
    <script type="text/javascript" des="文件">
        var dataGridInFiles = mini.get("dataGridInputFiles");
        dataGridInFiles.on("drawcell", inFileGridDrawCell);
        var dataGridOutFiles = mini.get("dataGridOutputFiles");
        dataGridOutFiles.on("drawcell", inFileGridDrawCell);

        function inFileGridDrawCell(e) {
            var column = e.column;
            if (column.name == "edit") {
                e.cellStyle = "text-align:center";
                e.cellHtml = '<span class="operationBtn icon-remove" title="删除" onclick="mini.get(\'' + e.sender.id + '\').removeRow(mini.get(\'' + e.sender.id + '\').getRowById(\'' + e.sender.getRow(e.rowIndex).ID + '\'));"></span>';
            }
        }
        function addFiles(gridID) {
            var row = { ID: newGuid() };
            mini.get(gridID).addRow(row, 0);
            mini.get(gridID).beginEditRow(row);
        }
    </script>
    <script type="text/javascript" desc="init data">
    var model=<%=ModelJson %>;
    if(model!=null){
        form.setData(model.Node);
        dataGridInFiles.addRows(model.InFiles);
        dataGridOutFiles.addRows(model.OutFiles);
try{
        dataGridInFiles.accept();
        dataGridOutFiles.accept();
        }catch(e){}

        var points=new Array();
        for(var i=0;i<model.PointContacts.length;i++){
            var point={ID:model.PointContacts[i].Point.ID,Order:model.PointContacts[i].Point.Order,Name:model.PointContacts[i].Point.PointItem.Name};
            points.push(point);
            var pointContactsObj = { Point: point, Contacts: new Array() }; 
            for(var j=0;j<model.PointContacts[i].Contacts.length;j++){
                pointContactsObj.Contacts.push(model.PointContacts[i].Contacts[j]);
            }
            pointContacts.push(pointContactsObj);
        }
        
        if(points.length>0){
            dataGridPoint.setData(points);
            dataGridPoint.select(0,true)
            pointGridSelect();
        }
    }
    </script>
    <script type="text/javascript" des="close&cancel event handler">
        function GetData() {
            var o = form.getData();
            o.ID = $("#hidID").val();
            var result = new Array();
            result.push(o);
            return result;
        }

    </script>
    <script type="text/javascript">
        $(function () {
            if ($("#hidProjectID").val() != "") {

            }
            $(".form-table").eq(1).width($(".form-table").eq(0).width());
        });
    </script>
</body>
</html>
